import { logDOM } from "@testing-library/react";
import React from "react";
import lodash from "lodash";
 export const Header: React.FC = () => {
// 接口地址：http://ajax-base-api-t.itheima.net/api/getbooks
// 请求方式：get
// 查询参数(可选)：

// 1、把代码封装成async异步函数
    async function getData() {
        // 通过try...catch语法处理async-await成功和失败的情况
        try {
            // 先获取Response对象
            let res = await fetch('http://ajax-base-api-t.itheima.net/api/getbooks')
            console.log(res)
            // 通过res.json() 取出response对象中的数据 await 后面是一个promise对象
            let json = await res.json()
            console.log(json)
        } catch (err) {
            // 捕获错误信息
            console.log(err)
        }
    }
getData()

    const getList = (datas: any) => { //包含dictCode dictName的数组对象 // [ { dictCode: "AHMLNH", dictName: "Alice" } ]
        console.log(1);
        const language = 'en-US'
        let mm = lodash
            .chain(lodash.keys(datas) || [])
            .map((key: any) => ({
            dictCode: key,
            dictName: datas[key]?.[language],
            }))
            .value() || []
        console.log('mm',mm);
        
        return mm
    };

    const dictionary: any = {
        'Dropdown_CLM_LetterGovHospital': {
            'AHMLNH': {'en-US': "Alice "},
            'BH':  {'en-US': 'Hong Kong'}
        }
    }

    //..map 的作用，
    //第一次遍历
    //第一次map为空对象，处理数组目标数组第一个数据，Dropdown_CLM_LetterGovHospital
    //
    //第二次遍历
    //把处理好的结果（对象）,放在map变量中，key则为 数组第二数据 
    //...map 展开第一次处理的结果，相当于给第二次遍历在对象中增加了 key value
   function get(maps: any){
    if (lodash.isArray(maps)) {
        let reduce =  lodash
          .chain(maps)
          .reduce((map: any, key: any) => {
            return {
              ...map,
              [key]: getList(dictionary?.[key] || {}),
            };
          }, {})
          .value();
        console.log('reduce------',reduce);
        return reduce
      }
   }

   const date = get(['Dropdown_CLM_LetterGovHospital','Dropdown_CLM_LetterPrivateHospital'])
   console.log('date',date);

   const key = 'a'
   const dic = {a:1, b:2}
   const value = dic[key]
   const dicti = {a: 1, c: 2}
   let res = dicti?.[key]
   let res1 = dicti?.[key]
   console.log(res);
   console.log(res1);

   const bq = [1,2]
    return(
        <>
            <div>1</div>
            <div>211</div>
            <div>{
                bq.map((info) => <div>{info}</div>)
            }</div>

            <div>
                {
                [<div>dcds</div>,<div>dcdsvc</div>,<div>dsvdsv</div>]
                }
            </div>
        </>
    )
 }